import React from 'react';
import {
  StyleSheet, View,
} from 'react-native';
import { FormText } from '../../../../components';

const InfoItem = ({
  datas, flag,
}) => (
  <View style={styles.container}>
    {datas && datas.length > 0 && (
      datas.map((data, index) => {
        return flag == 1 ? (
          <View style={styles.itemContainer} key={index}>
            <FormText name="名称" value={data.materialName} fontColor="black" />
            <FormText name="物料编码" value={data.materialCode} fontColor="black" />
            <FormText name="型号" value={data.materialSpecModel} fontColor="black" />
            <FormText name="供应商" value={data.supplierName} fontColor="black" />
            <FormText name="包装数量" value={`${data.packageQty == null ? '' : data.packageQty}${data.packageUnit == null ? '' : data.packageUnit}`} fontColor="black" />
            {/* <FormText name="包装内数量" value={data.materialName} fontColor="black" /> */}
            <FormText name="库区库位" value={data.locatorId} fontColor="black" />
            <FormText name="备件批次码" fontColor="black" />
            {
              data.mmLotDto.map((mdata, mindex) => (
                <FormText name={`${mdata.lotCode}${mdata.changeWeight ? `\n拆分出库${mdata.changeWeight}${data.consumeUnit}` : ''}`} fontColor="black" key={mindex} />
              ))
            }
          </View>
        ) : (
          <View style={styles.itemContainer} key={index}>
            <FormText name="名称" value={data.materialName} fontColor="black" />
            <FormText name="物料编码" value={data.materialCode} fontColor="black" />
            <FormText name="型号" value={data.materialSpecModel} fontColor="black" />
            <FormText name="供应商" value={data.supplierName} fontColor="black" />
            <FormText name="包装单位" value={data.packageUnit} fontColor="black" />
            <FormText name="发往" value={data.toWarehouseName} fontColor="black" />
            <FormText name="备件批次码" fontColor="black" />
            {
              data.mmLotDto.map((mdata, mindex) => (
                <FormText name={`${mdata.lotCode}${mdata.changeWeight ? `\n拆分出库 ${mdata.changeWeight} ${data.consumeUnit}` : ''}`} fontColor="black" key={mindex} />
              ))
            }
          </View>
        );
      })
    )}
  </View>
);

const styles = StyleSheet.create({
  container: {
    flex: 1,
    paddingBottom: 8,
  },
  itemContainer: {
    backgroundColor: 'white',
    borderRadius: 8,
    marginLeft: 8,
    marginRight: 8,
    marginTop: 8,
    padding: 8,
  },
});

export default InfoItem;
